<!-- 编辑弹窗 -->
<template>
  <ele-modal
    width="30%"
    :visible="visible"
    :close-on-click-modal="true"
    custom-class="ele-dialog-form"
    :title="isUpdate ? '修改仓库' : '添加仓库'"
    @update:visible="updateVisible"
  >
    <el-form ref="form" :model="form" :rules="rules" label-width="92px">
      <el-row :gutter="24">
        <el-col :md="24" :sm="24">
          <el-form-item label="仓库代码:" >
             <el-input v-model="form.code" disabled  placeholder="仓库代码默认自动生成" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :md="24" :sm="24">
          <el-form-item label="仓库名称:" prop="name">
            <el-input  v-model="form.name" placeholder="请输入仓库名称" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :md="24" :sm="24">
          <el-form-item label="仓库负责人:" >
            <el-select  v-model="form.account" filterable clearable multiple placeholder="请选择仓库负责人" style="width:100%" @change="selectAccount" >
              <el-option v-for="item in accountDatas" :key="item.id" :label="item.name" :value="item.id"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button @click="updateVisible(false)">取消</el-button>
      <el-button type="primary" :loading="loading" @click="save" v-if="this.btnindex!='3'" v-permission="'Basic_WareHouse_Save'">
        保存
      </el-button>
    </div>
  </ele-modal>
</template>

<script>
  import { QueryIsSysEnum } from '@/api/enummanger';
  import { GetAllAccount } from '@/api/usermanager/accountmanager';
  import { AddWarehouse,UpdateWarehouse } from '@/api/basicdatamanager/warehousemanager';

  export default {
    name: 'RoleEdit',
    props: {
      // 弹窗是否打开
      visible: Boolean,
      // 修改回显的数据
      data: Object,
      //按钮索引
      btnindex:String,
    },
    data() {
      return {
        // 表单数据
        form: {},
        // 表单验证规则
        rules: {
          name: [{required: true,message: '请输入仓库名称',trigger: 'blur'}],
        },
        // 提交状态
        loading: false,
        // 是否是修改
        isUpdate: false,
        //是否主仓枚举
        warehouseEnum: [],
        // 仓库负责人
        accountDatas:[],
      };
    },

    //初始化数据
    created(){
      this.queryWarehouseEnums();
    },
    methods: {
      
      /* 是否主仓枚举 */
      async queryWarehouseEnums(){
        let whEnums = await QueryIsSysEnum();
        whEnums.map(e=>{
          this.warehouseEnum.push({Key:e.Key===0?false:true,Value:e.Value});
        });
        
        await GetAllAccount().then((res)=>{

          this.accountDatas = [];
          this.accountDatas = res;
        });
      },

      setValue(){
        if(this.form.account){
          this.form.account = this.form.account.split(",");
        }
      },

      /* 保存编辑 */
      save() {
        //校验必填信息
        this.$refs['form'].validate((valid) => {
          if (!valid) {return false;}
          this.form.account = this.form.account.join(",");
          this.loading = true;
          const saveOrUpdate = this.isUpdate ? UpdateWarehouse : AddWarehouse;
          saveOrUpdate(this.form)
            .then((msg) => {
              this.loading = false;
              this.$message.success(msg);
              this.updateVisible(false);
              //回调父组件方法
              this.$emit('done');
            })
            .catch((e) => {
              this.loading = false;
              this.$message.error(e.message);
            });
        });
      },
      /* 更新visible */
      updateVisible(value) {
        //更新父组件中的visible的值
        this.$emit('update:visible', value);
      },

      //仓库负责人
      selectAccount(ids){
        var accountName = []
        ids.forEach((id) => {
          let obj = this.accountDatas.find((item)=>{
            return item.id === id;
          });
          if (obj) {
            accountName.push(obj.name)
          }
        });
        this.form.accountName = accountName.join(",");
      },
    },
    /* 监听visible属性变化 */
    watch: {
      visible(visible) {
        if (visible) {
          if (this.data && this.data.id) {
            //赋值this.form
            this.form = this.data;
            this.setValue();
            this.isUpdate = this.data.id !=null && this.data.id !=undefined;
          } else {
            this.form={};
            this.isUpdate = false;
          }
        } else {
          //移除校验结果并重置字段
          // this.$refs['form'].resetFields();
          //移除校验结果
          this.$refs['form'].clearValidate();
          this.form = {};
          if(this.data){
            this.isUpdate = this.data.id !=null && this.data.id !=undefined;
          }
        }
      }
    }
  };
</script>
